import React from "react";

import '@/assets/css/order_info.css'

const Comment = () => {
    // 接收跳转参数
    const [searchParams] = React.Router.useSearchParams()

    let [orderid, SetOrderid] = React.useState(searchParams.get('orderid') ? searchParams.get('orderid') : 0)

    let [order, SetOrder] = React.useState({
        status_text: '',
        status: 0,
        start_text: '',
        code: '',
        price: '',
        create_text: '',
        guest_text: '',
        end_text: '',
        day_text:'',
    })

    let [room, SetRoom] = React.useState({
        name: '',
        thumb_text: '',
        area: 0,
        live: 0,
        id:0
    })

    let [rate, SetRate] = React.useState(5)


    React.useEffect(() => {
        OrderInfo()
    }, [])

    // 获取订单和房间信息
    const OrderInfo = async () => {
        var result = await React.HTTP.post('/order/info', { id: orderid })

        if (result.code == 0) {
            React.error(result.msg)
            return false
        } else {
            SetOrder(result.data)
            SetRoom(result.data.room)
        }
    }

    // 提交评论
    const submit = async (value: any) => {
        value.orderid = orderid
        value.busid = React.Business.id
        var result = await React.HTTP.post('/order/comment',value)

        if(result.code == 0){
            React.error('评价失败',() => {})
            return false
        }else{
            React.success('评价成功')
            return false
        }
    }


    return (
        <>
            <React.UI.NavBar back='返回' onBack={() => React.navigate(-1)}>
                评价
            </React.UI.NavBar>

            <div className="order_info">
                <React.UI.Form
                    name='form'
                    layout='horizontal'
                    mode='card'
                    onFinish={submit}
                    initialValues={{
                        rate: rate
                    }}
                    footer={
                    <React.UI.Button block type='submit' color='primary' size='large'>
                     提交
                    </React.UI.Button>
                  }
                >
                    <React.UI.Form.Item name="rate" label="评分" rules={[{ required: true }]}>
                       <React.UI.Rate onChange={(val: any) => {SetRate(val)}} /> 
                    </React.UI.Form.Item>
                    
                    <React.UI.Form.Item name="comment" label="评价" rules={[{ required: true }]}>
                        <React.UI.TextArea placeholder="请输入评价"  showCount maxLength={100} />
                    </React.UI.Form.Item>

                </React.UI.Form>
                <div className="info_footer">
                        <div className="content_title">房屋信息：</div>
                        <div className="detail" onClick={() => React.navigate(`/room/info?rid=${room.id}`)}>
                            <div className="thumb">
                                <React.UI.Image src={room.thumb_text} />
                            </div>
                            <div className="right">
                                <p>{room.name}</p>
                                <div className="tips">
                                    <span>{room.area}㎡</span>
                                    <span>宜住{room.live}人</span>
                                </div>
                            </div>
                        </div>
                </div>
            </div>


            
        </>
    )
}


export default Comment;